<template>
  <el-dialog  :close-on-click-modal="false" :visible.sync="show" v-model="show" title="采购申请信息" :before-close="onClose" width="800"  >
    <div>
      <h3>基本信息</h3>
      <div  class="basicInfo">
        <p>采购单：{{ form.num }}</p>
        <p>预计价格：{{ form.price }}</p>
        <p>审批人：{{ form.auditInfoDto.createBy }}</p>
        <p>审批状态：
          <span v-if="form.auditInfoDto.auditStatus === '0'">待审核</span>
          <span v-if="form.auditInfoDto.auditStatus === '1'">通过</span>
          <span v-if="form.auditInfoDto.auditStatus === '2'">驳回</span>
        </p>
        <p>驳回原因：{{ form.auditInfoDto.rejectReason }}</p>
        <p>申请人：{{ form.applicant }}</p>
        <p>采购说明：{{ form.content }}</p>
        <p>申请时间：{{ form.auditInfoDto.createTime }}</p>
      </div>
    </div>
    <div>
      <h3>物品详情</h3>
      <el-table :data="dataList"  style="width: 100%">
        <el-table-column prop="name" label="物品名称" align="center">
        </el-table-column>
        <el-table-column prop="type" label="型号" align="center">
        </el-table-column>
        <el-table-column prop="unit" label="单位" align="center">
        </el-table-column>
        <el-table-column prop="amount" label="数量" align="center">
        </el-table-column>
        <el-table-column prop="price" label="单价" align="center">
        </el-table-column>
      </el-table>
    </div>
  </el-dialog>
</template>

<script>
import moment from 'moment'
import { getPurchaseRequestView } from '../../../api/base/buyapplay'

moment.locale('zh-cn')
export default {
  name: 'RurchaseView',
  props: {
    rurchaseShow: {
      // type: Boolean,
      default: false
    },
    viewId: {
      // type: Boolean,
      default: false
    },
    rurchaseData: {
      default: false,
      type: Object
    }
  },
  computed: {
    show: {
      get: function () {
        return this.rurchaseShow
      },
      set: function () {
      }
    },
    columns() {
      return [{
        title: '物品名称',
        dataIndex: 'name'
      }, {
        title: '型号',
        dataIndex: 'type'
      }, {
        title: '数量',
        dataIndex: 'amount'
      }, {
        title: '所属类型',
        dataIndex: 'consumableName'
      }, {
        title: '单位',
        dataIndex: 'unit'
      }, {
        title: '单价',
        dataIndex: 'price'
      }]
    }
  },
  data() {
    return {
      loading: false,
      dataList: [],
      current: 0,
      form:{}
    }
  },
  watch: {

  },
  created(){
    // this.getPurchaseRequestView()
  },
  mounted(){
    this.getPurchaseRequestView()
  },
  methods: {
    async getPurchaseRequestView() {
      const { data, code, msg } = await getPurchaseRequestView(this.rurchaseData.id)
      if (code === 200) {
        this.form = data
        this.dataList = data.goodsBelong
      }
    },
    onClose() {
      this.$emit('close')
    }
  }
}
</script>

<style scoped lang="scss">
.basicInfo{
  display: flex;
  flex-wrap: wrap;
  justify-content: space-around;
  p{
    width: 225px;
  }
}
</style>
